{include file="public/layout" /}
<body>
  <div class="layui-fluid">
      <div class="layui-row layui-col-space15">
          <div class="layui-col-md12">
            <div class="layui-card">
              <div class="layui-card-body" pad15>
                <div class="layui-form" wid100 lay-filter="">
                  <div class="layui-form-item">
                    <label class="layui-form-label"><b>*</b>字段标题</label>
                    <div class="layui-input-inline">
                     <input type="text" name="title" value="{$info.title|default=''}" lay-verify="required" class="layui-input">
                    </div>
                  </div>
                  <div class="layui-form-item">
                    <label class="layui-form-label"><b>*</b>字段名称</label>
                    <div class="layui-input-inline">
                        <input type="text" value="{$info.name|default=''}" {if condition="$info.ifsystem eq 1"} readonly {/if}  name="name" lay-verify="required|check_name" placeholder="只允许字母、数字和下划线的任意组合" class="layui-input" onkeyup="this.value=this.value.replace(/[^0-9a-zA-Z_]/g,'');" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^0-9a-zA-Z_]/g,''));">
                    </div>
                    <div class="layui-input-inline layui-btn-container " style="width: auto;">
                      <div class="layui-form-mid layui-word-aux ey_helptips"></div>
                      <div class="layui-form-inline2 ey_helptips_txt">保持唯一性，不可与主表、附加表重复</div>
                    </div>
                  </div>
                  <div class="layui-form-item">
                    <label class="layui-form-label"><b>*</b>字段类型</label>
                    <div class="layui-input-inline">
                      <select name="dtype" id="dtype" lay-filter="dtype" lay-verify="check_dtype"  {if condition="$info.ifsystem eq 1"} disabled="disabled" {/if} >
                        {volist name='$fieldtype_list' id='vo'}
                        <option value="{$vo.name}" data-ifoption="{$vo.ifoption|default=0}" {eq name="$info.dtype" value="$vo.name"}selected{/eq}>{$vo.title}</option>
                        {/volist}
                      </select>
                        <input type="hidden" name="old_dtype" value="{$info.dtype}"/>
                    </div>
                  </div>
                  <div class="layui-form-item none" id='region_db_div'>
                    <label class="layui-form-label">上级区域</label>
                    <div class="layui-input-inline">
                      <select name="dfvalue_id" id="dfvalue_id">
                        <option value="">请选择</option>
                        {volist name='$super_list' id='vo'}
                        <option {if condition="$vo.name == $info.dfvalue"} selected {/if} value="{$vo.name}">{$vo.title}</option>
                        {/volist}
                      </select>
                    </div>
                  </div>
                  <div class="none" id="region_div">
                      <div class="layui-form-item">
                        <label class="layui-form-label"><b>*</b>区域选择</label>
                        <div class="layui-input-inline w150">
                            <select id="province" lay-filter="province" lay-verify="check_province">
                                <option value="-1">请选择</option>
                                {volist name='$Province' id='P_V'}
                                <option {if condition="$P_V.id == $region.parent_id"} selected {/if} value="{$P_V.id}">{$P_V.name}</option>
                                {/volist}
                            </select>
                        </div>
                        <div class="layui-input-inline w150" id='CityId'>
                            <select id="city" lay-filter="city">
                                <option value="{$region.parent_id}">请选择</option>
                                {volist name='$City' id='C_V'}
                                    <option {if condition="$C_V.id == $region.region_id"} selected {/if} value="{$C_V.id}">{$C_V.name}</option>
                                {/volist}
                            </select>
                        </div>
                        <input type="hidden" id="GetRegionDataUrl" value="{:url('Field/get_region_data')}">
                        <input type="hidden" name="region_data[region_id]" id="RegionId" value="{$region.region_id}">
                      </div>
                      <div class="layui-form-item">
                        <label class="layui-form-label"><b>*</b>默认值</label>
                        <div class="layui-input-inline">
                            <textarea rows="5" cols="60" name="region_data[region_names]" id="region_names" readonly='readonly' class="layui-textarea" placeholder="这里会自动区域选择之后的下级区域列表" style="height:110px; background-color: #f5f5f5;">{$region.region_names}</textarea>
                            <input type="hidden" name="region_data[region_ids]" id='region_ids' value='{$region.region_ids}' style="width: 100%;">
                        </div>
                        <div class="layui-input-inline layui-btn-container " style="width: auto;">
                          <div class="layui-form-mid layui-word-aux ey_helptips"></div>
                          <div class="layui-form-inline2 ey_helptips_txt">这里会自动区域选择之后的下级区域列表</div>
                        </div>
                      </div>
                  </div>
                  <div class="layui-form-item none" id="dl_dfvalue">
                    <label class="layui-form-label" id="label_dfvalue">默认值</label>
                    <div class="layui-input-inline">
                        <textarea rows="5" cols="60" id="dfvalue" name="dfvalue" lay-verify="check_dfvalue" class="layui-textarea" placeholder="如果定义字段类型为下拉框、单选项、多选项时，此处填写被选择的项目(用“,”分开，如“男,女,人妖”),如果定义为数字类型且需要筛选时，此处填写被筛选的区间(用“,”分开，如“1000,3000,5000,10000”)。" style="height:76px;">{$info.dfvalue|default=''}</textarea>
                    </div>
                    <div class="layui-input-inline layui-btn-container " style="width: auto;">
                      <div class="layui-form-mid layui-word-aux ey_helptips"></div>
                      <div class="layui-form-inline2 ey_helptips_txt">如果定义字段类型为下拉框、单选项、多选项时，此处填写被选择的项目(用“,”分开，如“男,女,人妖”),如果定义为数字类型且需要筛选时，此处填写被筛选的区间(用“,”分开，如“1000,3000,5000,10000”)。</div>
                    </div>
                  </div>
                  <div class="layui-form-item" id="dl_dfvalue_unit">
                    <label class="layui-form-label">数值单位</label>
                    <div class="layui-input-inline">
                        <input type="text" value="{$info.dfvalue_unit|default=''}" name="dfvalue_unit" id="dfvalue_unit" placeholder="比如：元、个、件等等" class="layui-input">
                    </div>
                    <div class="layui-input-inline layui-btn-container " style="width: auto;">
                      <div class="layui-form-mid layui-word-aux ey_helptips"></div>
                      <div class="layui-form-inline2 ey_helptips_txt">比如：元、个、件等等</div>
                    </div>
                  </div>
                  <div class="layui-form-item" id='IsScreening'>
                    <label class="layui-form-label">应用于筛选</label>
                    <div class="layui-input-inline w70">
                        <input type="checkbox" lay-filter="is_screening" lay-skin="switch" lay-text="是|否" {if condition='$info.is_screening == 1'}checked{/if}>
                        <input type="hidden" name="is_screening" value="{$info.is_screening|default='0'}" />
                        <input type="hidden" name="IsScreening_status" value="0">
                    </div>
                    <div class="layui-input-inline layui-btn-container " style="width: auto;">
                      <div class="layui-form-mid layui-word-aux ey_helptips"></div>
                      <div class="layui-form-inline2 ey_helptips_txt">是否应用于列表的条件筛选中</div>
                    </div>
                    <!-- <a id="call_tags_help" href="http://www.ejucms.com/index.php?m=plugins&c=Ask&a=index" target="_blank" class="{if condition='!isset($info.is_screening) || empty($info.is_screening)'}none{/if}">查看标签调用</a> -->
                  </div>
                  <div class="layui-form-item">
                    <label class="layui-form-label">提示文字</label>
                    <div class="layui-input-inline">
                      <textarea name="remark" class="layui-textarea" placeholder="问号提示文字">{$info.remark|default=''}</textarea>
                    </div>
                  </div>
                  <div class="layui-form-item">
                    <label class="layui-form-label" id="select_title">{if condition='$info.is_screening == 1'}<b>*</b>{/if}指定栏目</label>
                    <div class="layui-input-inline">
                      <select id="typeid" lay-ignore lay-verify="check_typeid" style="width: 400px;" size="15" multiple="true">
                        <option value="0" {if condition="in_array(0, $typeids) OR empty($typeids)"}selected="true"{/if} {if condition='$info.is_screening == 1'} class="none" disabled {/if}>
                            —指定所有栏目—
                        </option>
                        
                        {$select_html}
                      </select>
                    </div>
                  </div>
                  <div class="layui-form-item">
                    <div class="layui-input-block">
                        <input type="hidden" name="channel_id" id="channel_id" value="{$info.channel_id|default=''}">
                        <input type="hidden" name="id" id="id" value="{$info.id|default=''}">
                        <input type="hidden" name="old_name" id="old_name" value="{$info.name|default=''}">
                        <input type="hidden" name="old_dtype" id="old_dtype" value="{$info.dtype|default=''}">
                        <button class="layui-btn" lay-submit lay-filter="formSubmit">确认提交</button>
                    </div>
                  </div>
              </div>
            </div>
          </div>
        </div>
  </div>

  <script>
  layui.config({
    base: '__SKIN__/' //静态资源所在路径
    ,version: '{$version}'
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'set'], function(){
    var $ = layui.$
    ,layer = layui.layer
    ,form = layui.form;

    var parentObj = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
      
    // 判断是否隐藏第二级地区选择栏
    var parent_array = {$parent_array};
    if (parent_array) {
        var region_id = $('#RegionId').val();
        if (0 <= $.inArray(region_id, parent_array)) {
            $('#CityId').hide();
        }    
    }
    dtype_change($('select[name=dtype]'));
    // form.render();

    form.verify({
      check_name: function(value, item){ //value：表单的值、item：表单的DOM对象
        var name = $('input[name="name"]').val();
        if (/^[0-9]+$/.test(name)) {
            return '字段名称不能纯数字！';
        } else if (/^((_+)|(\d+))$/.test(value) || !/^(\w+)$/.test(value)) {
            return '字段名称格式不正确！';
        } else if(/^type/.test(value)){
            return '字段名称不允许以type开头！';
        }
      }
      ,check_dtype: function(value, item){
        if ('' == value || undefined == value) {
            return '请选择字段类型！';
        }
      }
      ,check_dfvalue: function(value, item){
        var dtype_value = $('#dtype').find('option:selected').val();
        if (0 > $.inArray(dtype_value, ['region','region_db'])){
            var ifoption = $('#dtype').find('option:selected').data('ifoption');
            if (1 == ifoption) {
                if ($.trim($('#dfvalue').val()) == '') {
                    $('#dfvalue').focus();
                    return '默认值不能为空！';
                }

                var tag = '|';
                if($('#dfvalue').val().indexOf(tag) != -1){
                    $('#dfvalue').focus();
                    return '默认值不能输入 | 符号！';
            　　}
            }
        }
      }
      ,check_province: function(value, item){
        var dtype = $('select[name=dtype]').val();
        if ('region' == dtype) {
            if (-1 == value || undefined == value) {
                return '请选择区域！';
            }
            if (-1 == $('#RegionId').val()) {
                return '请选择区域范围！';
            }
        }
      }
      ,check_typeid: function(value, item){
        if (0 >= parseInt($('#typeid').find('option:selected').length)) {
            return '请选择指定栏目！';
        }
        // 字段应用于筛选时，指定栏目必须指定一个或多个栏目
        if (1 == parseInt($('input[name=is_screening]').val())) {
            if (0 == parseInt($('#typeid').find('option:selected').val())) {
                if (1 >= $('#typeid').val().length) {
                    return '字段应用于筛选时，栏目必须指定一个或多个！';
                }
            }
        }
      }
    }); 

    // 字段类型
    form.on('select(dtype)', function(data){
        $('#province').val('');
        $('#city').val('').hide();
        dtype_change(data.elem);
        form.render();
    });

    // 区域选择
    form.on('select(province)', function(data){
        GetRegionData(data.elem, 'province');
    });
    form.on('select(city)', function(data){
        GetRegionData(data.elem, 'city');
    });

    // 监听开关
    form.on('switch(is_screening)', function(data){
      var elemId = data.elem.attributes['lay-filter']['nodeValue'];
      if (data.elem.checked) {
        this.value = 1;
        $('#select_title').html('<b>*</b>指定栏目');
        $('#typeid').find('option:first').attr('disabled', true).addClass('none');
        $('#call_tags_help').show();
      } else {
        this.value = 0;
        $('#select_title').html('指定栏目');
        $('#typeid').find('option:first').attr('disabled', false).removeClass('none');
        $('#call_tags_help').hide();
      }
      $("input[name='"+elemId+"']").val(this.value);
    });

    //监听提交
    form.on('submit(formSubmit)', function(data){
        var load = layer_loading();
        data.field._ajax = 1;
        data.field.typeids = $('#typeid').val();
        $.ajax({
            type : 'post',
            url : "{:url('Field/channel_edit')}",
            data : data.field,
            dataType : 'json',
            success : function(res){
                layer.close(load); //关闭loading
                if(res.code == 1){
                    layer.msg(res.msg, {icon: 1, time: 1000}, function(){
                        parent.gourl(res.url);
                    });
                }else{
                    showErrorMsg(res.msg);
                }
            },
            error: function(e){
                layer.close(load); //关闭loading
                showErrorAlert();
            }
        });
        return false;
    });

    function dtype_change(obj) {
        var dtype = $(obj).val();
        var ifoption = $(obj).find('option:selected').data('ifoption');
        $('#region_db_div').hide();
        $('#dl_dfvalue').hide();
        if (0 <= $.inArray(dtype, ['datetime','switch','img','imgs','files'])) {
            ClearAreaData();
        } else if ('region' == dtype) {
            $('#region_div').show();
        }else if('region_db' == dtype){
            $('#region_db_div').show();
            ClearAreaData();
        } else {
            $('#dl_dfvalue').show();
            ClearAreaData();
        }
        if (1 == ifoption) {
            $('#label_dfvalue').html('<b>*</b>默认值');
        } else {
            $('#label_dfvalue').html('默认值');
        }
        if (0 <= $.inArray(dtype, ['region_db','region','checkbox','radio','select','int','float','decimal'])) {
            $('#IsScreening').show();
            $('input[name=IsScreening_status]').val(1);
        } else {
            $('#IsScreening').hide();
            $('input[name=IsScreening_status]').val(0);
            $('#select_title').html('指定栏目');
        }
        if (0 <= $.inArray(dtype, ['text','int','float','decimal'])) {
            $('#dl_dfvalue_unit').show();
        } else {
            $('#dl_dfvalue_unit').hide();
        }
    }

    // 当切换其他类型时清空所有关于区域选择的数据
    function ClearAreaData(){
        $('#region_div').hide();
        $('#RegionId').val('');
        $('#region_names').empty();
    }

    // 获取联动地址
    function GetRegionData(t,type){
        var parent_id = $(t).val();
        if(!parent_id){
            return false;
        }
        
        var load = layer_loading();
        var url = $('#GetRegionDataUrl').val();
        $.ajax({
            url: url,
            data: {parent_id:parent_id,_ajax:1},
            type:'post',
            dataType:'json',
            success:function(res){
                layer.close(load); //关闭loading
                // 判断是否隐藏第二级地区选择栏
                if (0 <= $.inArray(parent_id, res.parent_array)) {
                    $('#CityId').hide();
                }else{
                    $('#CityId').show();
                }
                // 加载城市名称数据到textarea
                $('#region_names').empty().html(res.region_names);
                // 加载城市ID数据到input
                $('#region_ids').val(res.region_ids);
                // 加载ID到input
                $('#RegionId').val(parent_id);
                // 输出下一级栏目选项
                if ('province' == type) {
                    res = '<option value='+parent_id+'>请选择</option>'+ res.region_html;
                    $('#city').empty().html(res);
                    form.render();
                }
            },
            error : function() {
                layer.close(load); //关闭loading
                showErrorAlert();
            }
        });
    }

  });

  </script>
{include file="public/footer" /}